<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <style>
        .el-carousel__item h3 {
            color: #475669;
            font-size: 14px;
            opacity: 0.75;
            line-height: 200px;
            margin: 0;
        }
    </style>
</head>
<body>
<div id="app" >
    <!--<template>-->
        <!--<el-carousel :interval="3000" type="card" height="1280px">-->
            <!--<el-carousel-item v-for="img in imgList" >-->
                <!--<img :src="img.src"/>-->
            <!--</el-carousel-item>-->
        <!--</el-carousel>-->
    <!--</template>-->
    <template>
        <div class="block">
            <span class="demonstration">默认</span>
            <el-date-picker
                    v-model="value1"
                    type="daterange"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期">
            </el-date-picker>
        </div>
    </template>

</div>

<script>
    new Vue({
        el:"#app",
        pickerOptions: {
            shortcuts: [{
                text: '最近一周',
                onClick(picker) {
                    const end = new Date();
                    const start = new Date();
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                    picker.$emit('pick', [start, end]);
                }
            }, {
                text: '最近一个月',
                onClick(picker) {
                    const end = new Date();
                    const start = new Date();
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                    picker.$emit('pick', [start, end]);
                }
            }, {
                text: '最近三个月',
                onClick(picker) {
                    const end = new Date();
                    const start = new Date();
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                    picker.$emit('pick', [start, end]);
                }
            }]
        },
        value1: '',
        data:{
            imgList: [
                {src:"../images/1.JPG"},
                {src:"../images/2.JPG"},
                {src:"../images/3.PNG"},
                {src:"../images/4.JPG"},
                {src:"../images/5.PNG"},
                {src:"../images/6.JPG"}
            ],
        },
    });
</script>
</body>
</html>